import { useState,Component } from "react";
// 华氏度和摄氏度 的温度转换
class Fahrenheit extends Component{
    
    render(){
        const {value,onChange} =this.props 
        let change=(e)=>{
            console.log(e);
            let num = (Number(e.target.value)-32)*5/9
            onChange(num)
        }
        return(
            <div>
                <div>华氏度温度</div>
                <input type="text" value={value} onChange={change} />
            </div>
        )
    }
}
function Centigrade(props){
    let {value,onChange} =props
    let change=(e)=>{
        onChange(e.target.value)
    }
    return(
        <div>
            <div>摄氏度温度</div>
            <input type="text" value={value} onChange={change} />
        </div>
    )
}

function Temperature (){
    const [temper,setTemper]=useState(0)
    return (
        <div>
            <Fahrenheit value={(temper*9/5)+32} onChange={(val)=>{setTemper(val)}} ></Fahrenheit>
            <Centigrade value={temper} onChange={(val)=>{setTemper(val)}} ></Centigrade>
        </div>
 
    )
}
export default Temperature